<!DOCTYPE html>
<html>
  <head>
  <meta http-equiv="content-type" content="text/html; charset=utf-8">
  <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport">
  <meta name="description" content="tong.li&#39;s blog">
  <meta name="keyword" content="彤哥哥博客，95后技术爱好者,现就职于同程旅行/同程艺龙上海分公司，专注于互联网技术分享的平台。">
  
    <link rel="shortcut icon" href="/css/images/icon.png">
  
  <title>
    
      局域网文件共享与下载服务新姿势 | 彤哥哥的博客
    
  </title>
  <link href="https://cdn.staticfile.org/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
  <link href="https://cdn.staticfile.org/nprogress/0.2.0/nprogress.min.css" rel="stylesheet">
  <link href="https://cdn.staticfile.org/highlight.js/9.12.0/styles/tomorrow-night.min.css" rel="stylesheet">
  
<link rel="stylesheet" href="/css/style.css">

  
  <script src="https://cdn.staticfile.org/jquery/3.2.1/jquery.min.js"></script>
  <script src="https://cdn.staticfile.org/geopattern/1.2.3/js/geopattern.min.js"></script>
  <script src="https://cdn.staticfile.org/nprogress/0.2.0/nprogress.min.js"></script>
  
    
<script src="/js/qrious.js"></script>

  
  
  
  
    <!-- MathJax support START -->
    <script type="text/x-mathjax-config">
      MathJax.Hub.Config({
        tex2jax: {
          inlineMath: [ ['$','$'], ["\\(","\\)"]  ],
          processEscapes: true,
          skipTags: ['script', 'noscript', 'style', 'textarea', 'pre', 'code']
        }
      });
    </script>

    <script type="text/x-mathjax-config">
      MathJax.Hub.Queue(function() {
        var all = MathJax.Hub.getAllJax(), i;
        for (i=0; i < all.length; i += 1) {
          all[i].SourceElement().parentNode.className += ' has-jax';
        }
      });
    </script>
    <script type="text/javascript" src="https://cdn.staticfile.org/mathjax/2.7.5/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>
    <!-- MathJax support END -->
  


  
  
    
<script src="/js/local-search.js"></script>


<meta name="generator" content="Hexo 5.4.2"></head>
<div class="wechat-share">
  <img src="/css/images/logo.png" />
</div>
  <body>
    <header class="header fixed-header">
  <div class="header-container">
    <a class="home-link" href="/">
      <div class="logo"></div>
      <span>彤哥哥的博客</span>
    </a>
    <ul class="right-list">
      
        <li class="list-item">
          
            <a href="/" class="item-link">主页</a>
          
        </li>
      
        <li class="list-item">
          
            <a href="/series/" class="item-link">分类</a>
          
        </li>
      
        <li class="list-item">
          
            <a href="/tags/" class="item-link">标签</a>
          
        </li>
      
        <li class="list-item">
          
            <a href="/archives/" class="item-link">归档</a>
          
        </li>
      
        <li class="list-item">
          
            <a href="/project/" class="item-link">项目</a>
          
        </li>
      
        <li class="list-item">
          
            <a href="/about/" class="item-link">关于</a>
          
        </li>
      
      
        <li class="menu-item menu-item-search right-list">
    <a role="button" class="popup-trigger">
        <i class="fa fa-search fa-fw"></i>
    </a>
</li>
      
    </ul>
    <div class="menu">
      <span class="icon-bar"></span>
      <span class="icon-bar"></span>
      <span class="icon-bar"></span>
    </div>
    <div class="menu-mask">
      <ul class="menu-list">
        
          <li class="menu-item">
            
              <a href="/" class="menu-link">主页</a>
            
          </li>
        
          <li class="menu-item">
            
              <a href="/series/" class="menu-link">分类</a>
            
          </li>
        
          <li class="menu-item">
            
              <a href="/tags/" class="menu-link">标签</a>
            
          </li>
        
          <li class="menu-item">
            
              <a href="/archives/" class="menu-link">归档</a>
            
          </li>
        
          <li class="menu-item">
            
              <a href="/project/" class="menu-link">项目</a>
            
          </li>
        
          <li class="menu-item">
            
              <a href="/about/" class="menu-link">关于</a>
            
          </li>
        
      </ul>
    </div>
    
      <div class="search-pop-overlay">
    <div class="popup search-popup">
        <div class="search-header">
            <span class="search-icon">
                <i class="fa fa-search"></i>
            </span>
            <div class="search-input-container">
                <input autocomplete="off" autocapitalize="off"
                    placeholder="Please enter your keyword(s) to search." spellcheck="false"
                    type="search" class="search-input">
            </div>
            <span class="popup-btn-close">
                <i class="fa fa-times-circle"></i>
            </span>
        </div>
        <div id="search-result">
            <div id="no-result">
                <i class="fa fa-spinner fa-pulse fa-5x fa-fw"></i>
            </div>
        </div>
    </div>
</div>
    
  </div>
</header>

    <div id="article-banner">
  <h2>局域网文件共享与下载服务新姿势</h2>
  <p class="post-date">2018-06-18</p>
  <div class="arrow-down">
    <a href="javascript:;"></a>
  </div>
</div>
<main class="app-body flex-box">
  <!-- Article START -->
  <article class="post-article">
    <section class="markdown-content"><p>在平常生活或工作中，我们经常需要传输文件，比如将电脑上下载的App传送到手机或另一台PC上、同事之间传输一些大型的文件。当我们遇到此类问题时，首先想到的就是使用QQ或者微信，更深一层，去网上搜索一些文件传输工具，如<a target="_blank" rel="noopener" href="https://send-anywhere.com/">Send Anywhere</a>，LZ当时在大学时候经常使用的是FTP、Samba服务。但是这些第三方要么都显得太麻烦（如下图），要么就是不安全，安全隐患主要在数据传输安全以及数据备份上体现，我们都需要将文件传输到第三方服务器上，再通过需要接收数据的电脑或手机进行下载。</p>
<p>那么，有没有办法直接获取文件，而不通过这些繁琐的操作？在这里呢，LZ给大家推荐几种常见的文件共享方法。</p>
<p><img src="https://ltyeamin.github.io/imgs/2020/07/20200731173318.png" alt="麻烦的交互"></p>
<h2 id="文件共享下载新姿势"><a href="#文件共享下载新姿势" class="headerlink" title="文件共享下载新姿势"></a>文件共享下载新姿势</h2><h3 id="最方便的Windows文件共享"><a href="#最方便的Windows文件共享" class="headerlink" title="最方便的Windows文件共享"></a>最方便的Windows文件共享</h3><p>LZ本人一年多没用过Windows电脑了,现在公司配置的是Mac Pro，家用的Lenovo Y430P已被改装为Deepin Linux,由于现在日常生活、工作都是在非Windows操作,所以这里就不演示了，等有机会会把详细教程列到这里。</p>
<p><a target="_blank" rel="noopener" href="https://jingyan.baidu.com/article/fec7a1e53efe621190b4e7ae.html">Windows文件共享</a></p>
<h3 id="最简单的Python命令共享"><a href="#最简单的Python命令共享" class="headerlink" title="最简单的Python命令共享"></a>最简单的Python命令共享</h3><p>大家都知道Python2与Python3不兼容,一般Linux和Mac OS X默认集成Python2,因为这些系统一些应用工具是Python2开发的，所以系统只能默认Python2。</p>
<ol>
<li><p>Python2的操作姿势</p>
<figure class="highlight bash"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line">Yeamin:book mac$ <span class="built_in">echo</span> litong</span><br><span class="line">litong</span><br><span class="line">Yeamin:book mac$ python -m SimpleHTTPServer 8900</span><br><span class="line">Serving HTTP on 0.0.0.0 port 8900 ...</span><br></pre></td></tr></table></figure></li>
<li><p>Python3的操作姿势</p>
<figure class="highlight sh"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">Yeamin:work mac$ python3 -m http.server 8900</span><br><span class="line">Serving HTTP on 0.0.0.0 port 8900 (http://0.0.0.0:8900/) ...</span><br></pre></td></tr></table></figure></li>
</ol>
<p>​    我在我的Mac或Linux终端执行简单的上述任意两个命令后，启动一个HTTP服务器，打开浏览器输入<a href="http://127.0.0.1:8900或http://localhost:8900">http://127.0.0.1:8900或http://localhost:8900</a>  后回出现下图文件共享的列表，若其他人想下载可以将局域网IP和端口号告知其他人即可下载。在这不仅仅可以下载，也可以预览常见文件，比如音频、视频、图片、PDF、文本文件。</p>
<p><img src="https://ltyeamin.github.io/imgs/2020/07/20200731173325.png" alt="共享列表预览"></p>
<h3 id="最专业的Nginx服务共享"><a href="#最专业的Nginx服务共享" class="headerlink" title="最专业的Nginx服务共享"></a>最专业的Nginx服务共享</h3><p>大家都知道单台的Nginx Web服务器并发性能较强,一般基本都是文件多并发大的情况下才用，企业里一般做路由转发、负载均衡、资源静态化，路由转发是为了对外统一暴露一个地址，负载均衡是根据某种算法(IP_HASH绑定策略、轮询策略、权重)将不同的请求分散到多台业务相同的机器上，资源静态化这个很常见，以前项目太大，会将JS/CSS单独分离，使得应用系统前端组件加载更快。</p>
<ul>
<li><p>下载Nginx</p>
<figure class="highlight sh"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br></pre></td><td class="code"><pre><span class="line">litong@LT:/media/litong/软件/programs/tools$ wget -c http://nginx.org/download/nginx-1.15.10.tar.gz</span><br><span class="line">--2019-03-31 14:03:53--  http://nginx.org/download/nginx-1.15.10.tar.gz</span><br><span class="line">正在解析主机 nginx.org (nginx.org)... 62.210.92.35, 95.211.80.227, 2001:1af8:4060:a004:21::e3</span><br><span class="line">正在连接 nginx.org (nginx.org)|62.210.92.35|:80... 已连接。</span><br><span class="line">已发出 HTTP 请求，正在等待回应... 200 OK</span><br><span class="line">长度：1032228 (1008K) [application/octet-stream]</span><br><span class="line">正在保存至: “nginx-1.15.10.tar.gz”</span><br><span class="line"></span><br><span class="line">nginx-1.15.10.tar.gz    100%[===============================&gt;]   1008K  13.4KB/s  用时 55s     </span><br><span class="line"></span><br><span class="line">2019-03-31 14:04:48 (18.4 KB/s) - 已保存 “nginx-1.15.10.tar.gz” [1032228/1032228])</span><br></pre></td></tr></table></figure></li>
<li><p>解压Nginx</p>
</li>
<li><p>```sh<br>tar -zxvf nginx-1.15.10.tar.gz </p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line"></span><br><span class="line">- 编译Nginx</span><br><span class="line"></span><br><span class="line">  ```SH</span><br><span class="line">  cd nginx-1.15.10/</span><br></pre></td></tr></table></figure></li>
<li><p>```sh<br>./configure</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line"></span><br><span class="line">```sh</span><br><span class="line">make</span><br></pre></td></tr></table></figure></li>
<li><p>```sh<br>sudo make install</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br></pre></td><td class="code"><pre><span class="line"></span><br><span class="line">- 启动Nginx</span><br><span class="line"></span><br><span class="line">- ```</span><br><span class="line">  cd /usr/local/nginx/sbin</span><br><span class="line">  ./nginx</span><br></pre></td></tr></table></figure>

<p>启动成功后，输入localhost:80，看是否启动成功进入到index.html，如下图:</p>
<p>  <img src="https://ltyeamin.github.io/imgs/2020/07/20200731173335.png" alt="Nginx启动首页"></p>
</li>
<li><p>查看启动进程</p>
<p>如果懒得打开浏览器，直接看进程确认nginx是否启动</p>
<figure class="highlight sh"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">litong@LT:usr/local/nginx/sbin$ ps -ef | grep nginx</span><br><span class="line">root      7017     1  0 11:07 ?        00:00:00 nginx: master process ./nginx</span><br></pre></td></tr></table></figure></li>
<li><p>重载Nginx</p>
<p>修改Nginx的配置文件nginx.conf,并进行重载配置:</p>
<figure class="highlight nginx"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br></pre></td><td class="code"><pre><span class="line"><span class="attribute">listen</span>       <span class="number">80</span>;        <span class="comment">#端口  </span></span><br><span class="line"><span class="attribute">server_name</span>  localhost;   <span class="comment">#服务名  </span></span><br><span class="line"><span class="attribute">charset</span> utf-<span class="number">8</span>; <span class="comment"># 避免中文乱码</span></span><br><span class="line"><span class="attribute">root</span>    /home/litong/Pictures;  <span class="comment">#显示的根索引目录，注意这里要改成你自己的，目录要存在  </span></span><br><span class="line"></span><br><span class="line"><span class="section">location</span> / &#123;</span><br><span class="line">    <span class="attribute">autoindex</span> <span class="literal">on</span>;             <span class="comment">#开启索引功能  </span></span><br><span class="line">    <span class="attribute">autoindex_exact_size</span> <span class="literal">off</span>; <span class="comment"># 关闭计算文件确切大小（单位bytes），只显示大概大小（单位kb、mb、gb）  </span></span><br><span class="line">    <span class="attribute">autoindex_localtime</span> <span class="literal">on</span>;   <span class="comment"># 显示本机时间而非 GMT 时间  </span></span><br><span class="line">&#125;</span><br></pre></td></tr></table></figure>
<figure class="highlight sh"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">./nginx -s reload</span><br></pre></td></tr></table></figure>

<p> 在浏览器端输入localhost:80, 则出现如下界面:</p>
<p><img src="https://ltyeamin.github.io/imgs/2020/07/20200731173342.png" alt="Nginx共享列表预览"></p>
</li>
</ul>
<h2 id="不同终端效果欣赏"><a href="#不同终端效果欣赏" class="headerlink" title="不同终端效果欣赏"></a>不同终端效果欣赏</h2><h3 id="Python共享-Mac-Pro-Mac-OS-X-10-14-1-Mojave"><a href="#Python共享-Mac-Pro-Mac-OS-X-10-14-1-Mojave" class="headerlink" title="[Python共享]Mac Pro / Mac OS X 10.14.1 Mojave"></a>[Python共享]Mac Pro / Mac OS X 10.14.1 Mojave</h3><p><img src="https://ltyeamin.github.io/imgs/2020/07/20200731173349.png" alt="视频预览"></p>
<p><img src="https://ltyeamin.github.io/imgs/2020/07/20200731173356.png" alt="图片预览"></p>
<p><img src="https://ltyeamin.github.io/imgs/2020/07/20200731173402.png" alt="文本预览"></p>
<p><img src="https://ltyeamin.github.io/imgs/2020/07/20200731173410.png" alt="PDF预览"></p>
<h3 id="Nginx共享-Lenovo-Y430P-Deepin-Linux"><a href="#Nginx共享-Lenovo-Y430P-Deepin-Linux" class="headerlink" title="[Nginx共享]Lenovo Y430P/ Deepin Linux"></a>[Nginx共享]Lenovo Y430P/ Deepin Linux</h3><h3 id=""><a href="#" class="headerlink" title=""></a><img src="https://ltyeamin.github.io/imgs/2020/07/20200731173416.png" alt="Nginx图片预览"></h3><h3 id="Python共享-XiaoMi-5X-Android-MIUI10"><a href="#Python共享-XiaoMi-5X-Android-MIUI10" class="headerlink" title="[Python共享]XiaoMi 5X/  Android-MIUI10"></a>[Python共享]XiaoMi 5X/  Android-MIUI10</h3><p><img src="https://ltyeamin.github.io/imgs/2020/07/20200731173429.jpeg" alt="手机视频预览"></p>
<h3 id="Windows共享-Lenovo-ThinkPad-T410-Microsoft-Windows-10-家庭版"><a href="#Windows共享-Lenovo-ThinkPad-T410-Microsoft-Windows-10-家庭版" class="headerlink" title="[Windows共享]Lenovo ThinkPad T410/Microsoft Windows 10 家庭版"></a>[Windows共享]Lenovo ThinkPad T410/Microsoft Windows 10 家庭版</h3><p>Windows后续再体验，未完待续。。。</p>
</section>
    <!-- Tags START -->
    
      <div class="tags">
        <span>Tags:</span>
        
  <a href="/tags#实用工具及技巧" >
    <span class="tag-code">实用工具及技巧</span>
  </a>

      </div>
    
    <!-- Tags END -->
    <!-- NAV START -->
    
  <div class="nav-container">
    <!-- reverse left and right to put prev and next in a more logic postition -->
    
      <a class="nav-left" href="/2018/06/12/RabbitMQ%E5%B7%A5%E4%BD%9C%E6%A8%A1%E5%BC%8F%E4%B9%8B%E7%AE%80%E5%8D%95%E6%A8%A1%E5%BC%8F/">
        <span class="nav-arrow">← </span>
        
          RabbitMQ工作模式之简单模式
        
      </a>
    
    
      <a class="nav-right" href="/2019/01/05/GC%E8%B0%83%E4%BC%98%E5%9F%BA%E7%A1%80%E4%B9%8B%E5%A0%86%E5%A4%A7%E5%B0%8F/">
        
          GC调优基础之堆大小
        
        <span class="nav-arrow"> →</span>
      </a>
    
  </div>

    <!-- NAV END -->
    <!-- 打赏 START -->
    
      <div class="money-like">
        <div class="reward-btn">
          赏
          <span class="money-code">
            <span class="alipay-code">
              <div class="code-image"></div>
              <b>使用支付宝打赏</b>
            </span>
            <span class="wechat-code">
              <div class="code-image"></div>
              <b>使用微信打赏</b>
            </span>
          </span>
        </div>
        <p class="notice">若你觉得我的文章对你有帮助，欢迎点击上方按钮对我打赏</p>
      </div>
    
    <!-- 打赏 END -->
    <!-- 二维码 START -->
    
      <div class="qrcode">
        <canvas id="share-qrcode"></canvas>
        <p class="notice">扫描二维码，分享此文章</p>
      </div>
    
    <!-- 二维码 END -->
    
      <!-- Utterances START -->
      <div id="utterances"></div>
      <script src="https://utteranc.es/client.js"
        repo="ltyeamin/blogtalks"
        issue-term="pathname"
        theme="github-light"
        crossorigin="anonymous"
        async></script>    
      <!-- Utterances END -->
    
  </article>
  <!-- Article END -->
  <!-- Catalog START -->
  
    <aside class="catalog-container">
  <div class="toc-main">
    <strong class="toc-title">Catalog</strong>
    
      <ol class="toc-nav"><li class="toc-nav-item toc-nav-level-2"><a class="toc-nav-link" href="#%E6%96%87%E4%BB%B6%E5%85%B1%E4%BA%AB%E4%B8%8B%E8%BD%BD%E6%96%B0%E5%A7%BF%E5%8A%BF"><span class="toc-nav-text">文件共享下载新姿势</span></a><ol class="toc-nav-child"><li class="toc-nav-item toc-nav-level-3"><a class="toc-nav-link" href="#%E6%9C%80%E6%96%B9%E4%BE%BF%E7%9A%84Windows%E6%96%87%E4%BB%B6%E5%85%B1%E4%BA%AB"><span class="toc-nav-text">最方便的Windows文件共享</span></a></li><li class="toc-nav-item toc-nav-level-3"><a class="toc-nav-link" href="#%E6%9C%80%E7%AE%80%E5%8D%95%E7%9A%84Python%E5%91%BD%E4%BB%A4%E5%85%B1%E4%BA%AB"><span class="toc-nav-text">最简单的Python命令共享</span></a></li><li class="toc-nav-item toc-nav-level-3"><a class="toc-nav-link" href="#%E6%9C%80%E4%B8%93%E4%B8%9A%E7%9A%84Nginx%E6%9C%8D%E5%8A%A1%E5%85%B1%E4%BA%AB"><span class="toc-nav-text">最专业的Nginx服务共享</span></a></li></ol></li><li class="toc-nav-item toc-nav-level-2"><a class="toc-nav-link" href="#%E4%B8%8D%E5%90%8C%E7%BB%88%E7%AB%AF%E6%95%88%E6%9E%9C%E6%AC%A3%E8%B5%8F"><span class="toc-nav-text">不同终端效果欣赏</span></a><ol class="toc-nav-child"><li class="toc-nav-item toc-nav-level-3"><a class="toc-nav-link" href="#Python%E5%85%B1%E4%BA%AB-Mac-Pro-Mac-OS-X-10-14-1-Mojave"><span class="toc-nav-text">[Python共享]Mac Pro &#x2F; Mac OS X 10.14.1 Mojave</span></a></li><li class="toc-nav-item toc-nav-level-3"><a class="toc-nav-link" href="#Nginx%E5%85%B1%E4%BA%AB-Lenovo-Y430P-Deepin-Linux"><span class="toc-nav-text">[Nginx共享]Lenovo Y430P&#x2F; Deepin Linux</span></a></li><li class="toc-nav-item toc-nav-level-3"><a class="toc-nav-link"><span class="toc-nav-text"></span></a></li><li class="toc-nav-item toc-nav-level-3"><a class="toc-nav-link" href="#Python%E5%85%B1%E4%BA%AB-XiaoMi-5X-Android-MIUI10"><span class="toc-nav-text">[Python共享]XiaoMi 5X&#x2F;  Android-MIUI10</span></a></li><li class="toc-nav-item toc-nav-level-3"><a class="toc-nav-link" href="#Windows%E5%85%B1%E4%BA%AB-Lenovo-ThinkPad-T410-Microsoft-Windows-10-%E5%AE%B6%E5%BA%AD%E7%89%88"><span class="toc-nav-text">[Windows共享]Lenovo ThinkPad T410&#x2F;Microsoft Windows 10 家庭版</span></a></li></ol></li></ol>
    
  </div>
</aside>
  
  <!-- Catalog END -->
</main>

<script>
  (function () {
    var url = 'http://example.com/2018/06/18/局域网文件共享与下载服务新姿势/';
    var banner = ''
    if (banner !== '' && banner !== 'undefined' && banner !== 'null') {
      $('#article-banner').css({
        'background-image': 'url(' + banner + ')'
      })
    } else {
      $('#article-banner').geopattern(url)
    }
    $('.header').removeClass('fixed-header')

    // error image
    $(".markdown-content img").on('error', function() {
      $(this).attr('src', '/css/images/error_icon.png')
      $(this).css({
        'cursor': 'default'
      })
    })

    // zoom image
    $(".markdown-content img").on('click', function() {
      var src = $(this).attr('src')
      if (src !== '/css/images/error_icon.png') {
        var imageW = $(this).width()
        var imageH = $(this).height()

        var zoom = ($(window).width() * 0.95 / imageW).toFixed(2)
        zoom = zoom < 1 ? 1 : zoom
        zoom = zoom > 2 ? 2 : zoom
        var transY = (($(window).height() - imageH) / 2).toFixed(2)

        $('body').append('<div class="image-view-wrap"><div class="image-view-inner"><img src="'+ src +'" /></div></div>')
        $('.image-view-wrap').addClass('wrap-active')
        $('.image-view-wrap img').css({
          'width': `${imageW}`,
          'transform': `translate3d(0, ${transY}px, 0) scale3d(${zoom}, ${zoom}, 1)`
        })
        $('html').css('overflow', 'hidden')

        $('.image-view-wrap').on('click', function() {
          $(this).remove()
          $('html').attr('style', '')
        })
      }
    })
  })();
</script>


  <script>
    var qr = new QRious({
      element: document.getElementById('share-qrcode'),
      value: document.location.href
    });
  </script>






    <div class="scroll-top">
  <span class="arrow-icon"></span>
</div>
    <footer class="app-footer">
  <p class="copyright">
    &copy; 2024 | Proudly powered by <a href="https://hexo.io" target="_blank">Hexo</a>
    <br>
    Theme by <a target="_blank" rel="noopener" href="https://github.com/ltyeamin">tong.li</a>
  </p>
</footer>

<script>
  function async(u, c) {
    var d = document, t = 'script',
      o = d.createElement(t),
      s = d.getElementsByTagName(t)[0];
    o.src = u;
    if (c) { o.addEventListener('load', function (e) { c(null, e); }, false); }
    s.parentNode.insertBefore(o, s);
  }
</script>
<script>
  async("https://cdn.staticfile.org/fastclick/1.0.6/fastclick.min.js", function(){
    FastClick.attach(document.body);
  })
</script>

<script>
  var hasLine = 'true';
  async("https://cdn.staticfile.org/highlight.js/9.12.0/highlight.min.js", function(){
    $('figure pre').each(function(i, block) {
      var figure = $(this).parents('figure');
      if (hasLine === 'false') {
        figure.find('.gutter').hide();
      }
      hljs.configure({useBR: true});
      var lang = figure.attr('class').split(' ')[1] || 'code';
      var codeHtml = $(this).html();
      var codeTag = document.createElement('code');
      codeTag.className = lang;
      codeTag.innerHTML = codeHtml;
      $(this).attr('class', '').empty().html(codeTag);
      figure.attr('data-lang', lang.toUpperCase());
      hljs.highlightBlock(block);
    });
  })
</script>
<!-- Baidu Tongji -->



<script src='https://cdn.staticfile.org/mermaid/8.11.2/mermaid.min.js'></script>



<script src="/js/script.js"></script>


  </body>
</html>